<template>
    <div class="history-box">
        <el-dialog title="案件调度记录" :visible.sync="scheduDialog">
            <el-timeline class="scroll-case-list">
                <el-timeline-item v-for="(activity, index) in activities" :key="index" :icon="activity.icon"
                    :type="activity.type" :color="activity.color" :size="activity.size" :timestamp="activity.timestamp">
                    <span class="timeline-content" v-if="activity.originalUserName"><span
                            class="timeitem-title">指派人:</span>{{
                                activity.originalUserName
                            }}</span>
                    <span class="timeline-content" v-if="activity.assignedUserId"><span
                            class="timeitem-title">坐席名称：</span>{{
                                activity.assignedUserName
                            }}
                    </span>
                    <span class="timeline-content" v-if="activity.assignedUserId"><span
                            class="timeitem-title">坐席工号：</span>{{
                                activity.assignedUserId }}
                    </span>
                    <span class="timeline-content"><span class="timeitem-title">案件来源：</span>{{ activity.assignType ==
                        '1' ?
                        "自动分配" : activity.assignType
                            ==
                            '2' ?
                            "坐席调度" :
                            activity.assignType ==
                                '4'
                                ?
                                "修理厂指定" : activity.assignType == '0' ? '待分配' : activity.assignType == '5' ? '地域分配规则' :
                                    "坐席指派"
                        }}</span>
                </el-timeline-item>
            </el-timeline>
        </el-dialog>
    </div>
</template>
<script>
import { mapState } from 'vuex'
import { taskAssignHistory } from '@/api/newRules'
export default {
    data() {
        return {
            scheduDialog: false,
            activities: []
        }
    },
    created() {
    },
    computed: {
        ...mapState({
            userInfo: state => state.user.userInfo
        })
    },
    methods: {
        // 调度记录
        taskAssignHistory(taskId) {
            this.scheduDialog = true;
            const params = {
                taskId: taskId,
                groupId: this.userInfo.group
            }
            taskAssignHistory(params).then(res => {
                this.scheduDialog = true
                this.activities = res.piccAssignLogList.map(item => {
                    item = {
                        originalUserName: item.originalUserName,
                        assignedUserName: item.assignedUserName,
                        assignedUserId: item.assignedUserId,
                        assignType: item.assignType,
                        timestamp: item.eventTime,
                        size: 'large'
                    }
                    return item
                })
            })

        },
    },
}
</script>
<style lang='scss' scoped>
.el-timeline {
    height: 500px;
    overflow: auto;
    padding: 20px 20px;

    .timeline-content {
        margin-left: 10px;
    }
}

.timeitem-title {
    font-weight: bold;
}
</style>
